@import '~react-grid-layout/css/styles.css';
@import '~react-resizable/css/styles.css';
@import url('../../../static/fonts/iconfont.css'); 
.dl {
    display: flex;
    height:100%;
}
.dl-left {
    width: 200px;
    height: 100%;
    .anticon-menu-fold{
        margin-right:10px;
    }
}
.dl-right {
    width: 100%;
    height: 100%;
    overflow: auto;
    #customized-pagination{
        height: 100%;
        .swiper-container{
            height: 100%;
        }
    }
}
.dl ul {
  padding: 20px;
}
.dl li {
  cursor: pointer;
  width: 160px;
  height: 36px;
  padding: 10px;
  background: rgba(236, 239, 245, 1);
  border-radius: 2px;
  list-style: none;
  margin-bottom: 10px;
  color: #555555;
  border: 1px solid transparent;
}
.dl .dl-left .checkedDom:hover{
    border: 1px dashed #0073E1;
    color: #0073E1;
}
.chartCon{
    box-shadow:0px 1px 1px 0px rgba(74,81,93,0.1);
    &:hover .editremove{
        display:block;
        pointer-events: all!important;
    }
    .emptyDiv{
        width:100%;
        height:100%;
        .emptyFirst{
            font-size:12px;
            color:#111111;
            line-height:30px;
            height:30px;
            padding-left:9px;
            font-weight:bold;
        }
        .emptyCon{
            width:100%;
            height:calc(~'100% - 30px');
            display:flex;
            flex-direction:column;
            align-items:center;
            justify-content:center;
            .emptyImg{
                width:80px;
                height:80px;
            }
            .emptyText{
                color:#888888;
                font-size:12px;
                margin-top:10px;
            }
        }
    }
    position: relative;
    .removeChart{
        position:absolute;
        right:0;
        top:0;
        width:18px;
        height:18px;
        background:#ECEFF5;
        color:#555555;
        line-height:18px;
        text-align:center;
        display:none;
        cursor: pointer;
        z-index: 10;
    }
    .tabCon{
        position: absolute;
        left: 10px;
        bottom: 26px;
        width: calc(~'100% - 20px');
        .sntTable{
            width: 100%;
            border-right: 1px solid #E8E8E8;
            border-bottom: 1px solid #E8E8E8;
            color:#0D1424;
            td{
                font-size:12px;
                height: 18px;
                line-height: 18px;
                padding-left:10px;
                border-left: 1px solid #E8E8E8;
                border-top: 1px solid #E8E8E8;
                transform: scale(0.83);
            }
        }
    }
    .chartBorder{
        position:absolute;
        left:0;
        top:30px;
        width:100%;
    }
}
// .hideNavigation{
//     visibility: hidden;
// }
.swiper-button-next, .swiper-button-prev{
    width:20px;
    height:30px;
    background-size: 20px 30px;
}
.swiper-button-next{
    background-image: url(../images/hryou.png);
}
.swiper-button-next:hover{
    background-image: url(../images/hryou-hover.png);
}
.swiper-button-prev{
    background-image: url(../images/hrzuo.png);
}
.swiper-button-prev:hover{
    background-image: url(../images/hrzuo-hover.png);
}
.sbtNext:hover{
    background-image: url(../images/hryou2-hover.png)!important;
}
.sbtPrev:hover{
    background-image: url(../images/hrzuo2-hover.png)!important;
}
.blankDiv{
    width:100%;
    height:100%;
    text-align:center;
    font-size: 14px;
    color: #909399;
    display:table;
    .blankSpan{
        display:table-cell;
        vertical-align:middle;
    }
}
.gridClass{
    background-image: linear-gradient(rgba(225, 225, 225, 0.7) 1px, transparent 0),
                      linear-gradient(to right,rgba(225, 225, 225, 0.7) 1px, transparent 0),
                      linear-gradient(#D9D9D9 1px, transparent 0),
                      linear-gradient(to right, #D9D9D9 1px, transparent 0);
    background-size: 12px 12px, 12px 12px, 48px 48px, 48px 48px;
}